<html>
	<head>
		<?php echo $this->headMeta(); ?>
		<?php echo $this->headTitle(); ?>
		<?php echo $this->headLink(); ?> 
		<?php echo $this->headScript(); ?>
		<script type="text/javascript">
			var baseURL = "<?php echo $this->baseUrl() ?>";
		</script>
	</head>
	<body bgcolor="#ffffff">
		
		<div id="container" style="position: relative;margin-left: auto;margin-right: auto;width: 1024px">
			<div id="Header" ><img src="<?php echo $this->baseUrl() ?>/images/logo.png" width="178px" height="62px" /></div>
			<div id="Menu" >
				<ul >
					<li class="actif" sm="pedagogique"> <a href="#" ref="parametrage">Gestion P&eacute;dagogique</a> </li>
					<li sm="emploie"> <a href="<?php echo $this->baseUrl(); ?>/emploidutemps" ref="matiere">Emploies du temps</a> </li>
					<li sm="notes"> <a href="#" ref="temps">Notes</a> </li>
					<li sm="parametrage"> <a href="#" ref="temps">Parametrage</a> </li>
				</ul>
			</div>
			<div id="SousMenu">
				<div id="pedagogique" class="sm">
					 <ul >
						<li class="sous_actif"> <a href="#">U. E.</a> </li>
						<li> <a href="#">Mati&eacute;res</a> </li>
					</ul>
					<ul >
						<li class="sous_actif"> <a href="#">Niveau</a> </li>
						<li> <a href="#">Etudiant</a> </li>
					</ul>
				</div>
				<div id="emploie" class="sm">
					 <ul >
						<li class="sous_actif"> <a href="#">A</a> </li>
						<li> <a href="#">B</a> </li>
					</ul>
					<ul >
						<li class="sous_actif"> <a href="#">Niveau</a> </li>
						<li> <a href="#">Etudiant</a> </li>
					</ul>
				</div>
			</div>
			
			<div id="Content" class="arrondi">
				<?php  echo $this->layout()->content; ?> 
			</div>
		</div>
		<script type="text/javascript">
			$('#Menu li').click(function(){
				$('.actif').removeClass ('actif');
				$(this).closest('li').addClass("actif");
				var max = eval($("#Menu").offset().left) + eval($("#Menu").width()) - eval($("#SousMenu").width()) - eval($('#container').offset().left);
				var pos = eval($(this).offset().left) - eval($('#container').offset().left);
				$('.sm').css('visibility','hidden')
				var SousMenu = $('.actif').attr('sm');
				$('#' + SousMenu).css('visibility','visible')
				if (pos > max)
				 	pos = max
				$('#SousMenu').animate({
					left : ""+pos
				});
			});
			
			var SousMenu = $('.actif').attr('sm');
			//alert($('#' + SousMenu).css('visibility'));
			$('#' + SousMenu).css('visibility','visible')
			
		</script>
	</body>
</html>